<table class="table table-striped table-condensed">
    <thead>
    <tr>
        <th>User Name</th>
        <th>Total Num Jobs (Slots)</th>
        <th>Num Pending Jobs (Slots)</th>
        <th>Num Running Jobs (Slots)</th>
        <th>Num Suspended Jobs (Slots)</th>

    </tr>
    </thead>
    <tbody>
    {% for user in user_list %}
        <tr id="user_{{ user.name }}_row">
            <td><a href="{% url 'olw_user_view' user.name %}">{{ user.name }}</a></td>
            <td id="user_{{ user.name }}_total">{{ user.total_jobs }} ({{ user.total_slots }})</td>
            <td id="user_{{ user.name }}_pending">{{ user.num_pending_jobs }} ({{ user.num_pending_slots }})</td>
            <td id="user_{{ user.name }}_running">{{ user.num_running_jobs }} ({{ user.num_running_slots }})</td>
            <td id="user_{{ user.name }}_suspended">{{ user.num_suspended_jobs }} ({{ user.num_suspended_jobs }})</td>
        </tr>
    {% empty %}
        <tr>
            <td colspan="5">No Users</td>
        </tr>
    {% endfor %}
    </tbody>
</table>
<script>
    function update_user_list() {
        olwclient.User.getUserList(function (users) {
            users.forEach(function (user) {
                if ($("#user_" + user.name + "_row").html()) {
                    $("#user_" + user.name + "_total").text(user.total_jobs + ' (' + user.total_slots + ')');
                    $("#user_" + user.name + "_pending").text(user.num_pending_jobs + ' (' + user.num_pending_slots + ')');
                    $("#user_" + user.name + "_running").text(user.num_running_jobs + ' (' + user.num_running_slots + ')');
                    $("#user_" + user.name + "_suspended").text(user.num_suspended_jobs + ' (' + user.num_suspended_slots + ')');
                }
            });
            setTimeout(update_user_list, 30000);
        }, function (errType, message) {
            console.log("Unable to update user list: " + message);
            setTimeout(update_user_list, 30000);
        });
    }

    $(function () {
        olwclient.serverUrl("{% url 'olw_system_view' %}");
        setTimeout(update_user_list, 30000);
    });
</script>